<template>
	<view class="tabbar">
		<u-tabbar :value="value" @change="change5" :safeAreaInsetBottom="false" activeColor="#FF589B" :placeholder="false" >
			<u-tabbar-item text="首页">
				<i class="ico  active" slot="active-icon"></i>
				<i class="ico " slot="inactive-icon"></i>
			</u-tabbar-item>
			<u-tabbar-item text="红娘">
				<i class="ico active" slot="active-icon"></i>
				<i class="ico" slot="inactive-icon"></i>
			</u-tabbar-item>
			<u-tabbar-item>
				<em class="ico middle" slot="inactive-icon"></em>
				<em class="ico middle" slot="active-icon"></em>
			</u-tabbar-item>
			<u-tabbar-item text="学堂">
				<i class="ico active" slot="active-icon"></i>
				<i class="ico" slot="inactive-icon"></i>
			</u-tabbar-item>
			<u-tabbar-item text="我的" i>
				<i class="ico active" slot="active-icon"></i>
				<i class="ico" slot="inactive-icon"></i>
			</u-tabbar-item>
		</u-tabbar>
		
	</view>
</template>

<script>
export default {
	name: 'tabbar',
	props:['value'],
	data() {
		return {
			value5: 0,
			
		};
	},
	onLoad() {},
	methods: {
		change5(name) {
			// if (name === 1) return uni.$u.toast('请您先登录');
			// else this.value5 = name;
			switch(name){
				case 0:
				uni.navigateTo({
					url:"/pages/index/index"
				});
				break;
				case 1:
				uni.navigateTo({
					url:"/pages/matchmaker/matchmaker"
				});
				break;
				case 2:
				
				break;
				case 3:
				uni.navigateTo({
					url:"/pages/school/school"
				});
				break;
				case 4:
				uni.navigateTo({
					url:"/pages/me/me"
				});
				break;
				default:
				break;
			}
		},
		
	}
};
</script>

<style lang="scss" scoped>
.tabbar {
	.ico {
		font-size: 48rpx;
		color: #cbcbca;
	}
	.active {
		color: #ff589b !important;
	}
	.middle {
		width: 96rpx;
		height: 80rpx;
		font-size: 40rpx;
		display: block;
		background-image: -webkit-linear-gradient(-90deg, rgba(255, 88, 155, 0.7) 0%, rgba(255, 88, 155, 0.9) 100%);
		border-radius: 40rpx;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
</style>
